<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="layui/css/layui.css" media="all">
    <title>信息列表</title>
    <style>
        .header {
            height: 80px;
            border-bottom: 1px solid #404553;
            background-color: #ffffff;
        }

        .title {
            color: #404553;
            font-size: 18px;
            float: left;
            padding-top: 40px;
        }

        .ti_btn {
            color: #404553;
            float: left;
            padding-top: 40px;
            float: right;
        }

        .layerpage {
            float: right;
        }
    </style>
</head>
<script src="js/jQuery/jquery-2.2.3.min.js"></script>
<script src="layui/layui.js"></script>
<script src="layui/laytpl.js"></script>

<body class="layui-layout-body">
    <div class="layui-header header header-doc">
        <div class="layui-main">
            <div class="title">
                <h2>信息列表</h2>
            </div>
            <div class="ti_btn">
                <button class="layui-btn layui-btn-warm" onclick="add_info()">添加信息</button>
            </div>
        </div>
    </div>
    <div class="layui-main">
        <div class="layui-box">
            <table class="layui-table">
                <colgroup>
                    <col width="150">
                    <col width="200">
                    <col>
                </colgroup>
                <thead>
                    <tr>
                        <th>序号</th>
                        <th>查询编号</th>
                        <th>业务件号</th>
                        <th>添加时间</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody id="list_view">

                </tbody>
            </table>
        </div>
        <div id="page" class="layerpage"></div>
    </div>
</body>
<script type="text/html" id="list_tpl">
    <tr>
            <td>{{d.ID}}</td>
            <td>{{d.CXBH}}</td>
            <td>{{d.YWJH}}</td>
            <td>{{d.SJ}}</td>
            <td>
                <button class="layui-btn layui-btn-sm layui-btn-normal" onclick="show({{d.ID}})">查看</button>
                <button class="layui-btn layui-btn-sm" onclick="update({{d.ID}})">修改</button>
                <button class="layui-btn layui-btn-sm layui-btn-danger" onclick="delete({{d.ID}})">删除</button>
                <button class="layui-btn layui-btn-sm layui-btn-primary" onclick="ewm({{d.ID}})">二维码</button>
            </td>
        </tr>
</script>
<script>
    var apiurl = 'http://localhost:8066'
    layui.use('laypage', function () {
        var laypage = layui.laypage;
        //执行一个laypage实例
        laypage.render({
            elem: 'page'
            , limit: 10
            , count: 500
            , jump: function (obj, first) {
                //obj包含了当前分页的所有参数，比如：
                // console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
                // console.log(obj.limit); //得到每页显示的条数
                //showdata(obj.curr, obj.limit)
                //首次不执行
                if (!first) {
                    //do something
                }
            } //数据总数，从服务端得到
        });
    });

    function add_info() {
        window.location.href = "info.html"
    }
    //获取列表
    $.ajax({
        url: "/api/getindexlist",
        type: "POST",
        data: {},
        success: function (d) {
            console.log(d)
            var view = $("#list_view")
            var tpl = $("#list_tpl").html()
            var src = ''
            for (var i in d.aadata) {
                laytpl(tpl).render(d.aadata[i], function (html) {
                    src += html;
                });
            }
            view.empty()
            view.append(src)
        }
    });
</script>

</html>